
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="${ctxStatic}/modules/jiujiu/css/bootstrap.min.css">
		<script src="${ctxStatic}/modules/jiujiu/js/jquery.min.js"></script>
		<script src="${ctxStatic}/modules/jiujiu/js/bootstrap.min.js"></script>
		<style>
			@font-face {
				 font-family: 'iconfont';  
				 src: url('//at.alicdn.com/t/font_dbt3unt0d46de7b9.eot');
				 src: url('//at.alicdn.com/t/font_dbt3unt0d46de7b9.eot?#iefix') format('embedded-opentype'),
				 url('//at.alicdn.com/t/font_dbt3unt0d46de7b9.woff') format('woff'),
				 url('//at.alicdn.com/t/font_dbt3unt0d46de7b9.ttf') format('truetype'),
				 url('//at.alicdn.com/t/font_dbt3unt0d46de7b9.svg#iconfont') format('svg');
			}
			.iconfont {
				font-family: "iconfont";
				font-size: 50px;
				font-style: normal;
			 }
			.iconfont2 {
				font-family: "iconfont";
				font-size: 18px;
				font-style: normal;
				color: #868888;
			 }			
			* {
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
				margin: 0;
				padding: 0;
				-webkit-text-size-adjust: none;
			}
			
			body {
				height: 100%;
				font-family: Microsoft YaHei, Helvetica, Tahoma;
			}
			
			.fl {
				float: left;
			}
			
			.fr {
				float: right;
			}
			.fl .zuo{
				padding-top: 10px;
				font-size: 20px;
				font-weight: bold;
			}
			.panel-lirun {
				border-color: #A7ECB3;
			}
			
			.panel-lirun>.panel-heading {
				background-color: #A9E2B8;
				border-color: #7BDC9D;
				color: #1F5404;
			}
			.panel-xyjifen {
				border-color: rgba(226, 204, 49, 0.43);
			}
			
			.panel-xyjifen>.panel-heading {
				background-color: #FFEFC1;
				border-color: #D4C349;
				color: #543404;
			}
			.panel-djjifen{
				border-color:rgba(167, 167, 162, 0.43);
			}
			.panel-djjifen>.panel-heading{
				background-color: #F1F1F1;
				border-color: #D0D0D0;
				color: #272625;
			}
			td{
				padding: 10px;
			}
			.td span:nth-child(1){
				font-size: 18px;
				line-height: 40px;
			}	
			.td span:last-child{
				font-size: 30px;
				font-weight: bold;
			}	
			.right1{
				width: 30%;
				text-align: right;
				font-size: 18px;
				margin-right: 10px;
			}
			.right2{
				text-align: left;
				border-left: 1px solid #fff;
				font-size: 30px;
				font-weight: bold;
			}
			/*数字滚动插件的CSS可调整样式*/
			
			.mt-number-animate {
				font-family: '微软雅黑';
				line-height: 40px;
				height: 40px;
				/*设置数字显示高度*/
				;
				font-size: 36px;
				/*设置数字大小*/
				overflow: hidden;
				display: inline-block;
				position: relative;
			}
			
			.mt-number-animate .mt-number-animate-dot {
				width: 15px;
				/*设置分割符宽度*/
				line-height: 40px;
				float: left;
				text-align: center;
			}
			
			.mt-number-animate .mt-number-animate-dom {
				width: 20px;
				/*设置单个数字宽度*/
				text-align: center;
				float: left;
				position: relative;
				top: -5px;
			}
			
			.mt-number-animate .mt-number-animate-dom .mt-number-animate-span {
				width: 100%;
				float: left;
			}
			.span_desc{
				font-size: 10px;
				color: #a09292;
			}
		</style>
		
		<script>
			//选择支出账户
			function expenditure(){
				
				var href="${ctx}/jiujiu/jiuManufactor/memberList?type=7";
				top.$.jBox.open('iframe:'+href,'选择支出账户',$(top.document).width()-800,$(top.document).height()-120,{
					buttons:{"关闭":true},
					loaded:function(h){
						$(".jbox-content", top.document).css("overflow-y","hidden");
						$(".nav,.form-actions,[class=btn]", h.find("iframe").contents()).hide();
						$("body", h.find("iframe").contents()).css("margin","10px");
					}
				});
				
				return false;
			}
		</script>
	</head>
	<body style="background-color:#f5f0ec">
		<div class="container">
			<div class="row"  style="margin: 35px  -80px 0px -80px;" >
				<div class="col-md-6">										
					<div class="panel panel-success">
						<div class="panel-heading">
							<h3 class="panel-title">
								<div class="fl">								
					  				<p class="zuo">充值记录</p>
								</div>
								<div class="fr">								
									<i class="iconfont" style="font-size: 30px;">&#xe6d0;</i>
								</div>
								<div style="clear: both;"></div>	
							</h3>
						</div>
						<div class="panel-body" style="padding: 0px;">
							<table  border="1" cellpadding="1" cellspacing="1" style="width: 100%;text-align: center;  height: 270px;  border: 1px solid #d6e9c6;">	
								<%-- <tr>								
									<td colspan="3"  class="td">
										<span>充值总积分</span>
										<br/>
										<span><fmt:formatNumber type="number" value="${sumStorePoint+sumFrozenPoint}" pattern="0.00" maxFractionDigits="2"/></span>
									</td>
								</tr> --%>
								<tr>								
									<td height="50px" rowspan="2" class="td" width="200px">
										<span style="">充值总金额</span>
										<br/>
										<span>￥<fmt:formatNumber type="number" value="${empty rechargeLogList[0].d ? 0.00 : rechargeLogList[0].d}" pattern="0.00" maxFractionDigits="2"/></span>
									</td>
									<td class="right1">
										线上充值										
									</td>
									<td class="right2">
										￥<fmt:formatNumber type="number" value="${empty rechargeLogList[1].d ? 0.00 : rechargeLogList[1].d}" pattern="0.00" maxFractionDigits="2"/>
									</td>
								</tr>
								<tr>								
									<td class="right1">
										线下充值									
									</td>
									<td class="right2">
										￥<fmt:formatNumber type="number" value="${empty rechargeLogList[2].d ? 0.00 : rechargeLogList[2].d}" pattern="0.00" maxFractionDigits="2"/>
									</td>
								</tr>
								<tr>								
									<td height="50px" rowspan="2" class="td" width="200px">
										<span style="">充值总积分</span>
										<br/>
										<span><fmt:formatNumber type="number" value="${empty rechargeLogList[3].d ? 0.00 : rechargeLogList[3].d}" pattern="0" maxFractionDigits="0"/></span>
									</td>
									<td class="right1">
										线上充分										
									</td>
									<td class="right2">
										<fmt:formatNumber type="number" value="${empty rechargeLogList[4].d ? 0.00 : rechargeLogList[4].d}" pattern="0" maxFractionDigits="0"/>
									</td>
								</tr>
								<tr>								
									<td class="right1">
										线下充分									
									</td>
									<td class="right2">
										<fmt:formatNumber type="number" value="${empty rechargeLogList[5].d ? 0.00 : rechargeLogList[5].d}" pattern="0" maxFractionDigits="0"/>
									</td>
								</tr>
								
									
							</table>
						</div>
					</div>
				</div>
				<div class="col-md-6">										
					<div class="panel panel-info">
						<div class="panel-heading">
							<h3 class="panel-title">
							<div class="fl">								
				  				<p class="zuo">提现记录</p>
							</div>
							<div class="fr">								
								<i class="iconfont" style="font-size: 30px;">&#xe605;</i>
							</div>
							<div style="clear: both;"></div>	
						</h3>
						</div>
						<div class="panel-body" style="padding: 0px;">
							<table  border="1" cellpadding="1" cellspacing="1" style="width: 100%;text-align: center;  height: 270px;  border: 1px solid #bce8f1;">	
								<!-- <tr>								
									<td colspan="3"  class="td">
										<span style="">扣除积分</span>
										<br/>
										<span>0.00</span>
									</td>
								</tr> -->
								<tr>								
									<td height="50px" rowspan="2" class="td" width="200px">
										<span style="">提现总金额</span>
										<br/>
										<span>￥${empty statWithdrawalsList[0].d ? 0.00 : statWithdrawalsList[0].d}</span>
									</td>
									<td class="right1">
										申请转款金额
										
									</td>	
									<td class="right2">
										￥${empty statWithdrawalsList[1].d ? 0.00 : statWithdrawalsList[1].d}
									</td>
								</tr>
								<tr>								
									<td class="right1">
										已转款金额										
									</td>
									<td class="right2">
										￥${empty statWithdrawalsList[2].d ? 0.00 : statWithdrawalsList[2].d}
									</td>
								</tr>
								<tr>								
									<td height="50px" rowspan="2" class="td" width="200px">
										<span style="">提现扣除总积分</span>
										<br/>
										<span><fmt:formatNumber type="number" value="${empty statWithdrawalsList[3].d ? 0.00 : statWithdrawalsList[3].d}" pattern="0" maxFractionDigits="0"/></span>
									</td>
									<td class="right1">
										申请转款积分
										
									</td>	
									<td class="right2">
										<fmt:formatNumber type="number" value="${empty statWithdrawalsList[4].d ? 0.00 : statWithdrawalsList[4].d}" pattern="0" maxFractionDigits="0"/>
									</td>
								</tr>
								<tr>								
									<td class="right1">
										已转款积分										
									</td>
									<td class="right2">
										<fmt:formatNumber type="number" value="${empty statWithdrawalsList[5].d ? 0.00 : statWithdrawalsList[5].d}" pattern="0" maxFractionDigits="0"/>
									</td>
								</tr>		
							</table>
						</div>
					</div>
				</div>
				</div>
				<div class="row" style="margin: 50px -80px 0px -80px;" >
				<a href="${ctx}/jiujiu/jiuWithdrawalsLog?status=1">
				<div class="col-md-4">
					<div class="panel panel-info">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
								<div class="fl">
									<%-- <p style="font-size: 40px;line-height: 60px;" ><fmt:formatNumber type="number" value="${sumNowMoney}" pattern="0.00" maxFractionDigits="2"/> </p> --%>
					  				<p  style="font-size: 40px;line-height: 60px;" class="numberRun1"></p>
					  				<p>平台现有金额</p>
								</div>
								<div class="fr">							
									<i class="iconfont">&#xe605;</i>
								</div>
								<div style="clear: both;"></div>	
							</h3>
							<span class="span_desc">充值总金额-已转款金额</span>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2">&#xe61f;</i>
							</div>
						</div>
					</div>
				</div>	
				</a>
				
			  <a href="${ctx}/jiujiu/jiuStore?examineState=1">							
				<div class="col-md-4">
					<div class="panel panel-xyjifen">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
							<div class="fl">
								<%-- <p style="font-size: 40px;line-height: 60px;"><fmt:formatNumber type="number" value="${sumStorePoint}" pattern="0.00" maxFractionDigits="2"/></p> --%>
				  				<p  style="font-size: 40px;line-height: 60px;" class="numberRun2"></p>
				  				<p>平台现有积分</p>
							</div>
							<div class="fr">
								<i class="iconfont">&#xe62d;</i>
							</div>
							<div style="clear: both;"></div>	
							<span class="span_desc">各门店积分相加</span>
						</h3>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2"  >&#xe61f;</i>									
							</div>
						</div>
					</div>
				</div>
			</a>
			<a href="${ctx}/jiujiu/jiuWithdrawalsLog?status=500">
				<div class="col-md-4">
					<div class="panel panel-lirun">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
							<div class="fl">
								<%-- <p style="font-size: 40px;line-height: 60px;"><fmt:formatNumber type="number" value="${profitMoney}" pattern="0.00" maxFractionDigits="2"/></p> --%>
				  				<p  style="font-size: 40px;line-height: 60px;" class="numberRun3"></p>
				  				<p>平台剩余金额</p>
							</div>
							<div class="fr">
								<i class="iconfont">&#xe604;</i>
							</div>
							<div style="clear: both;"></div>	
							<span class="span_desc">充值总金额-提现总金额</span>
						</h3>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2" >&#xe61f;</i>									
							</div>
						</div>
					</div>
				</div>
				</a>
				</div>
				
				<div class="row" style="margin: 50px -80px 0px -80px;">
				<a href="${ctx}/jiujiu/jiuWithdrawalsLog?status=1">
					<div class="col-md-4">
					<div class="panel panel-success">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
							<div class="fl">
								<!-- <p style="font-size: 40px;line-height: 60px;">123555</p> -->
								<p  style="font-size: 40px;line-height: 60px;" class="numberRun4"></p>
				  				<p>平台剩余积分</p>
							</div>
							<div class="fr">
								<i class="iconfont" style="color: #3c763d;">&#xe610;</i>
							</div>
							<div style="clear: both;"></div>	
							<span class="span_desc">充值总积分-已转款积分=平台现有积分+冻结积分+申请转款积分</span>
						</h3>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2"  >&#xe61f;</i>
							</div>
							</div>
						</div>
					</div>
				</a>	
				<a href="${ctx}/jiujiu/jiuOrder?states=200">	
					<div class="col-md-4">
					<div class="panel panel-djjifen">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
							<div class="fl">
								<p style="font-size: 40px;line-height: 60px;" class="numberRun5"></p>
				  				<p>冻结积分</p>
							</div>
							<div class="fr">
								<i class="iconfont" style="color: #9C9A98;">&#xe624;</i>
							</div>
							<div style="clear: both;"></div>	
						</h3>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2"  >&#xe61f;</i>
							</div>
							</div>
						</div>
					</div>	
					
				</a>	
				
					
			<c:choose>
			    <c:when test="${abnormal eq 0}">
			     	<a href="javascript:alert('没有检测到异常，请放心使用')">
			    </c:when>
			    <c:otherwise>
			   <a href="${ctx}/jiujiu/jiuBalancePaymentsLog/abnormalList">
			    </c:otherwise>
			</c:choose>		
				<div class="col-md-4">
					<div class="panel panel-danger">
						<div class="panel-heading" style="padding: 35px 15px;">
							<h3 class="panel-title">
							<div class="fl">
								<%-- <p style="font-size: 40px;line-height: 60px;"><fmt:formatNumber type="number" value="${abnormal}" pattern="0.00" maxFractionDigits="2"/></p> --%>
				  				<p style="font-size: 40px;line-height: 60px;" class="numberRun6"></p>
				  				<p>异常数据</p>
							</div>
							<div class="fr">
								<i class="iconfont">&#xe60b;</i>
							</div>
							<div style="clear: both;"></div>	
						</h3>
						</div>
						<div class="panel-body">
							<div class="fl">
								查看详情
							</div>
							<div class="fr">
								<i class="iconfont2"  >&#xe61f;</i>
							</div>
						</div>
					</div>
				</div>
				</a>
			  </div>		        
			</div>
	  	</div>
	  	<c:set var="shengyu_money" value="${empty statWithdrawalsList[1].d ? 0.00 : statWithdrawalsList[1].d}"></c:set>
	  	
	</body>
	<script>
		function jiuDefrayLog(){
		 window.location.href="${ctx}/jiujiu/jiuDefrayLog?status=1";
		}
	</script>
	<script>
		
		(function($) {
			$.fn.numberAnimate = function(setting) {
				var defaults = {
					speed: 1000, //动画速度 
					num: "", //初始化值 
					iniAnimate: true, //是否要初始化动画效果 
					symbol: '', //默认的分割符号，千，万，千万 
					dot: 0 //保留几位小数点 
				}
				//如果setting为空，就取default的值 
				var setting = $.extend(defaults, setting);

				//如果对象有多个，提示出错 
				if($(this).length > 1) {
					alert("just only one obj!");
					return;
				}

				//如果未设置初始化值。提示出错 
				if(setting.num == "") {
					alert("must set a num!");
					return;
				}
				 var nHtml = '<div class="mt-number-animate-dom" data-num="{{num}}">\<span class="mt-number-animate-span">0</span>\<span class="mt-number-animate-span">1</span>\<span class="mt-number-animate-span">2</span>\<span class="mt-number-animate-span">3</span>\<span class="mt-number-animate-span">4</span>\<span class="mt-number-animate-span">5</span>\<span class="mt-number-animate-span">6</span>\<span class="mt-number-animate-span">7</span>\<span class="mt-number-animate-span">8</span>\<span class="mt-number-animate-span">9</span>\<span class="mt-number-animate-span">.</span>\</div>';

				//数字处理 
				var numToArr = function(num) {
					num = parseFloat(num).toFixed(setting.dot);
					if(typeof(num) == 'number') {
						var arrStr = num.toString().split("");
					} else {
						var arrStr = num.split("");
					}
					//console.log(arrStr); 
					return arrStr;
				}

				//设置DOM symbol:分割符号 
				var setNumDom = function(arrStr) {
					var shtml = '<div class="mt-number-animate">';
					for(var i = 0, len = arrStr.length; i < len; i++) {
						if(i != 0 && (len - i) % 3 == 0 && setting.symbol != "" && arrStr[i] != ".") {
							shtml += '<div class="mt-number-animate-dot">' + setting.symbol + '</div>' + nHtml.replace("{{num}}", arrStr[i]);
						} else {
							shtml += nHtml.replace("{{num}}", arrStr[i]);
						}
					}
					shtml += '</div>';
					return shtml;
				}

				//执行动画 
				var runAnimate = function($parent) {
					$parent.find(".mt-number-animate-dom").each(function() {
						var num = $(this).attr("data-num");
						num = (num == "." ? 10 : num);
						var spanHei = $(this).height() / 11; //11为元素个数 
						var thisTop = -num * spanHei + "px";
						if(thisTop != $(this).css("top")) {
							if(setting.iniAnimate) {
								//HTML5不支持 
								if(!window.applicationCache) {
									$(this).animate({
										top: thisTop
									}, setting.speed);
								} else {
									$(this).css({
										'transform': 'translateY(' + thisTop + ')',
										'-ms-transform': 'translateY(' + thisTop + ')',
										/* IE 9 */
										'-moz-transform': 'translateY(' + thisTop + ')',
										/* Firefox */
										'-webkit-transform': 'translateY(' + thisTop + ')',
										/* Safari 和 Chrome */
										'-o-transform': 'translateY(' + thisTop + ')',
										'-ms-transition': setting.speed / 1000 + 's',
										'-moz-transition': setting.speed / 1000 + 's',
										'-webkit-transition': setting.speed / 1000 + 's',
										'-o-transition': setting.speed / 1000 + 's',
										'transition': setting.speed / 1000 + 's'
									});
								}
								
							} else {
								setting.iniAnimate = true;
								$(this).css({
									top: thisTop
								});
							}
						}
					});
				}

				//初始化 
				var init = function($parent) {
					//初始化 
					$parent.html(setNumDom(numToArr(setting.num)));
					runAnimate($parent);
				};

				//重置参数 
				this.resetData = function(num) {
					var newArr = numToArr(num);
					var $dom = $(this).find(".mt-number-animate-dom");
					if($dom.length < newArr.length) {
						$(this).html(setNumDom(numToArr(num)));
					} else {
						$dom.each(function(index, el) {
							$(this).attr("data-num", newArr[index]);
						});
					}
					runAnimate($(this));
				}
				//init 
				init($(this));
				return this;
			}
		})(jQuery);

		$(function() {

			//初始化 
			var numRun1 = $(".numberRun1").numberAnimate({
				num: "${sumNowMoney}",
				dot: 2,//保留几位小数点 
				speed: 3000
			});

			var numRun2 = $(".numberRun2").numberAnimate({
				num: "${sumStorePoint}",
				dot: 2,//保留几位小数点 
				speed: 3000
			});
			var numRun3 = $(".numberRun3").numberAnimate({
				num: "${sumNowMoney - shengyu_money}",
				dot: 2,//保留几位小数点 
				speed: 3000
			});

			var numRun4 = $(".numberRun4").numberAnimate({
				num: "${sumStorePoint+sumWithdrawalsIngPoint+sumFrozenPoint}",
				dot: 2,//保留几位小数点 
				speed: 3000
			});
			var numRun5 = $(".numberRun5").numberAnimate({
				num: "${sumFrozenPoint}",
				dot: 2,//保留几位小数点 
				speed: 3000
			});

			var numRun6 = $(".numberRun6").numberAnimate({
				num: "${abnormal}",
				dot: 0,//保留几位小数点 
				speed: 3000
			});
			

		});
	</script>
</html>